@mixin palette-blue {
  --hbs-primary: #{$blue-primary};
  --hbs-primary-light: #{$blue-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-blue {
  @include palette-blue;
}

@mixin palette-blue-gray {
  --hbs-primary: #{$blue-gray-primary};
  --hbs-primary-light: #{$blue-gray-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-blue-gray {
  @include palette-blue-gray;
}

@mixin palette-brown {
  --hbs-primary: #{$brown-primary};
  --hbs-primary-light: #{$brown-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-brown {
  @include palette-brown;
}

@mixin palette-cyan {
  --hbs-primary: #{$cyan-primary};
  --hbs-primary-light: #{$cyan-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-cyan {
  @include palette-cyan;
}

@mixin palette-green {
  --hbs-primary: #{$green-primary};
  --hbs-primary-light: #{$green-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-green {
  @include palette-green;
}

@mixin palette-indigo {
  --hbs-primary: #{$indigo-primary};
  --hbs-primary-light: #{$indigo-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-indigo {
  @include palette-indigo;
}

@mixin palette-orange {
  --hbs-primary: #{$orange-primary};
  --hbs-primary-light: #{$orange-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-orange {
  @include palette-orange;
}

@mixin palette-pink {
  --hbs-primary: #{$pink-primary};
  --hbs-primary-light: #{$pink-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-pink {
  @include palette-pink;
}

@mixin palette-purple {
  --hbs-primary: #{$purple-primary};
  --hbs-primary-light: #{$purple-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-purple {
  @include palette-purple;
}

@mixin palette-red {
  --hbs-primary: #{$red-primary};
  --hbs-primary-light: #{$red-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-red {
  @include palette-red;
}

@mixin palette-teal {
  --hbs-primary: #{$teal-primary};
  --hbs-primary-light: #{$teal-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-teal {
  @include palette-teal;
}

@mixin palette-yellow {
  --hbs-primary: #{$yellow-primary};
  --hbs-primary-light: #{$yellow-primary-light};
  --hbs-accent: var(--hbs-primary);
}

.palette-yellow {
  @include palette-yellow;
}

.palettes {
  color: #{$white};
}

.palette.active a:after {
  content: "√";
  padding-left: .25rem;
}
